import type { SidebarsConfig } from '@docusaurus/plugin-content-docs'

/**
 * Creating a sidebar enables you to:
 - create an ordered group of docs
 - render a sidebar for each doc of that group
 - provide next/previous navigation

 The sidebars can be generated from the filesystem, or explicitly defined here.

 Create as many sidebars as you want.
 */
const sidebars: SidebarsConfig = {
  // By default, Docusaurus generates a sidebar from the docs folder structure
  // mainSidebar: [{ type: 'autogenerated', dirName: '.' }],

  // Or create a sidebar manually
  mainSidebar: [
    'index',
    // 'all/index',
    'atoms',
    'colors',
    [
      {
        type: 'link',
        href: '/sandbox',
        label: 'Sandbox',
      },
    ],
    {
      type: 'category',
      label: 'Components',
      link: {
        type: 'generated-index',
        title: 'Components',
      },
      items: [{ type: 'autogenerated', dirName: 'components' }],
    },
    {
      type: 'category',
      label: 'Form',
      // link: {
      //   type: 'doc',
      //   id: 'form/index'
      //   // type: 'generated-index',
      //   // title: 'Form',
      // },
      items: [{ type: 'autogenerated', dirName: 'form' }],
    },
    { type: 'html', value: `<hr>` },

    'content',
    'layout',
    'utilities',

    // { type: 'autogenerated', dirName: 'examples' },
    [
      {
        type: 'html',
        value: `<hr><b style="margin-left:.75rem;">Example Pages</b>`,
      },
      // {
      //   type: 'link',
      //   href: '/sandbox',
      //   label: 'Sandbox',
      // },

      { type: 'link', label: 'Album', href: '/examples/album' },
      { type: 'link', label: 'Badges', href: '/examples/badges' },
      { type: 'link', label: 'Blog', href: '/examples/blog' },
      { type: 'link', label: 'Breadcrumbs', href: '/examples/breadcrumbs' },
      { type: 'link', label: 'Buttons', href: '/examples/buttons' },
      { type: 'link', label: 'Carousel', href: '/examples/carousel' },
      { type: 'link', label: 'Checkout', href: '/examples/checkout' },
      { type: 'link', label: 'Cover', href: '/examples/cover' },
      { type: 'link', label: 'Dashboard', href: '/examples/dashboard' },
      { type: 'link', label: 'Dropdowns', href: '/examples/dropdowns' },
      { type: 'link', label: 'Features', href: '/examples/features' },
      { type: 'link', label: 'Footers', href: '/examples/footers' },
      { type: 'link', label: 'Grid', href: '/examples/grid' },
      { type: 'link', label: 'Headers', href: '/examples/headers' },
      { type: 'link', label: 'Heroes', href: '/examples/heroes' },
      { type: 'link', label: 'Jumbotron', href: '/examples/jumbotron' },
      { type: 'link', label: 'Jumbotrons', href: '/examples/jumbotrons' },
      { type: 'link', label: 'List groups', href: '/examples/list-groups' },
      // { type: 'link', label: 'masonry', href: '/examples/masonry' },
      { type: 'link', label: 'Modals', href: '/examples/modals' },
      { type: 'link', label: 'Navbar bottom', href: '/examples/navbar-bottom' },
      { type: 'link', label: 'Navbar fixed', href: '/examples/navbar-fixed' },
      { type: 'link', label: 'Navbars', href: '/examples/navbars' },
      {
        type: 'link',
        label: 'Navbars offcanvas',
        href: '/examples/navbars-offcanvas',
      },
      {
        type: 'link',
        label: 'Navbar -static',
        href: '/examples/navbar-static',
      },
      {
        type: 'link',
        label: 'Offcanvas navbar',
        href: '/examples/offcanvas-navbar',
      },
      { type: 'link', label: 'Pricing', href: '/examples/pricing' },
      { type: 'link', label: 'Product', href: '/examples/product' },
      { type: 'link', label: 'Sidebars', href: '/examples/sidebars' },
      { type: 'link', label: 'Sign-in', href: '/examples/sign-in' },
      {
        type: 'link',
        label: 'Starter template',
        href: '/examples/starter-template',
      },
      { type: 'link', label: 'Sticky footer', href: '/examples/sticky-footer' },
      {
        type: 'link',
        label: 'Sticky footer navbar',
        href: '/examples/sticky-footer-navbar',
      },
      {
        type: 'link',
        label: 'Theme switcher',
        href: '/examples/theme-switcher',
      },
    ],

    // {
    //   type: 'category',
    //   label: 'Examples',
    //   // link: {
    //   //   type: 'generated-index',
    //   //   title: 'Examples',
    //   // },
    //   items: [
    //     // { type: 'autogenerated', dirName: '../lib/examples' }
    //   ]
    // },
  ],
}

export default sidebars
